<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Enchi</title>
    <link rel="stylesheet" href="css/popup.css">

    <style>
        body {
            text-align: center;
            width: 316px;
            height: 401px;
        }
    </style>
</head>

<body>
    <div class="enchi">
        <div class="noLogin" id="noLogin">
            <img src="img/logo.png" class="logo" />
            <p class="title">Card Notes</p>
            <div class="content">
                <p class="noLoginDesc">One click collection ultimate experience</p>
                <p class="noLoginDesc">Label classification is clear at a glance</p>
                <p class="noLoginDesc">Free editing is unimpeded</p>
                <input type="button" value="Sign in" id="signInBtn">
            </div>
        </div>
        <div class="isLogin" id="isLogin">
            <img src="img/avatar.png" id="avatar" class="avatar" />
            <p class="isLoginDesc" id="nickname">Enchi_user_01928</p>
            <p class="isLoginDesc" id="email">xxxxxxx.xxxxxx@gmail.com</p>
            <input type="button" value="Sign out" id="signOutBtn">
        </div>

    </div>

</body>
<script src="js/popup.js"></script>

</html>